import { Component, OnInit } from '@angular/core';
import { User } from "../User";
import { UserServiceService } from "../user-service.service";
import { Router } from '@angular/router'
// import { ViewEncapsulation } from '@angular/core';
@Component({
    selector: 'app-user-table',
    templateUrl: './user-table.component.html',
    styleUrls: ['./user-table.component.less']
})

export class UserTableComponent implements OnInit {
    /**
     * 初始化用户集合
     */
    users: User[] = []
    columns = [{ name: 'id' }, { name: 'name' }, { name: 'sex' }, { name: 'addr' }];
    totalrow: number = 0;
    currentpage: number = 1;
    totalPage: number = 10;
    thispage: number = 0;

    /**
     *  私有化处理  
     * @param userService
     * @param route
     */
    constructor(private userService: UserServiceService, private route: Router) {
    }


    ngOnInit() {
        this.getUsers(1, 10)
    }


    /**
     * 获取用户集合的方法
     */

    getUsers(current: number, limit: number): void {
        console.log(current)

        this.userService.getUsersPage(current, limit)
            .subscribe((res) => {
                console.log(res.data)
                this.users = res.data.rows
                this.currentpage = current //当前页
                this.thispage = limit
                this.totalrow = res.data.total//一共多少条
                this.totalPage = this.totalrow / this.currentpage                     //一共多少页 
            });
    }
    change(event: any): void {
        this.getUsers(event.page, 10)
    }
    


    /**
     * 进入无id的adduser路由
     */
    goto() {
        this.route.navigate(['adduser'])
    }

    /**
     * 携带用户id进入adduser路由
     */
    choose(event: any) {
        if (event.type == 'click') {
            this.route.navigate(['adduser/' + event.row.id])
            console.log(event.row);
        }
    }



}


